<template>
	<div class="content">
		<div class="searchBox">
			<span class="searchText">标题:</span><input type="text" class="searchInput" placeholder="请输入标题" v-model="title">
			<span class="searchText">事项状态:</span>
			<select class="searchInput" v-model="state">
				<option value="">请选择事项状态</option>
				<option value="1">待办事项</option>
				<option value="2">已办事项</option>
			</select>
			<span class="searchText">时间:</span>
			<el-date-picker v-model="time" type="datetimerange" :picker-options="pickerOptions" range-separator="~" start-placeholder="开始日期" end-placeholder="结束日期" align="right">
			</el-date-picker>
			<div class="searchBut" @click="searchNewsData"><img src="../../assets/search.png" class="foundPic"/>搜索</div>
		</div>
		<div class="textContent">
      <img src="~_assets/nosearch.png" class="searchResult" v-show="showImg">
			<div class="textNews" v-for='(data,index) in data1' :key="index">
				<div class="tipIcon"><img :src="srcValue(data)"/></div>
				<div class="tipPicDiv">
					<p class="actTittle">"{{data.activityTheme}}"{{data.TasksMap.taskName}}</p><img :src="imgValue(data.TasksMap.statusCode)" class="tipPic"/>
				</div>
				<p class="actTime"><span>时间：{{data.modifyTime}}</span><span class="actSubmit">提交人：{{data.operator}}</span></p>
				<div class="textBtns">
					<p class="deal" @click="goDeal(data)">{{getDeal(data.TasksMap.statusCode)}}</p>
				</div>
			</div>
			<!-- <el-pagination
			background
			@size-change="handleSizeChange"
			@current-change="handleCurrentChange"
			:current-page="tablePage.currentPage"
			:page-size="tablePage.pageSize"
			layout="prev, pager, next"
			:total="tablePage.total">
			</el-pagination> -->
		</div>
	</div>
</template>

<script>
import { time } from "_config/common.js";
import { SAVE_OR_EDIT_SETTING,GET_ALL_TODOANDDONE_BY_PARAM } from "@/config/url";
import Bus from '@/bus.js'

export default {
  data() {
    return {
      pickerOptions: time,
      time: "", //时间
      title: "", //标题
      state: "", //事项状态
      data1: {},//列表
      showImg: false,
      activityCode:sessionStorage.getItem('activityCode')
      // tablePage: {
      //   currentPage: 1,
      //   pageSize: 3,
      //   total: 0
      // }
    };
  },
  created() {
    this.searchNewsData();
  },
  methods: {
    srcValue(data) {
      if(data.TasksMap.statusCode == 1){
        if (data.viewStatus == 1) {
          return require("_assets/read.png");
        }else{
          return require("_assets/unread.png");
        }
      }else if(data.TasksMap.statusCode == 2){
        return require("_assets/read.png");
      }
    },
    imgValue(status) {
      if (status == 1) {
        return require("_assets/needto.png");
      } else if (status == 2) {
        return require("_assets/old.png");
      }
    },
    getDeal(status) {
      if (status == 1) {
        return "办理";
      } else if (status == 2) {
        return "查看";
      }
    },
    // handleSizeChange(val) {
    //   this.tablePage.pageSize = val;
    //   this.searchNewsData();
    // },
    // handleCurrentChange(val) {
    //   this.tablePage.currentPage = val;
    //   this.searchNewsData(); 
    // },
    searchNewsData() {
      let startTime;
      let endTime;
      if (this.time == "" || this.time == undefined || this.time == null) {
        startTime = "";
        endTime = "";
      } else {
        startTime = this.moment(this.time[0]).format("YYYY-MM-DD HH:mm:ss");
        endTime = this.moment(this.time[1]).format("YYYY-MM-DD HH:mm:ss");
      }
      let that = this;
      this.$fetch(GET_ALL_TODOANDDONE_BY_PARAM, {
        title: this.title,
        state: this.state,
        startTime: startTime,
        endTime: endTime,
        // page: this.tablePage.currentPage,
        // size: this.tablePage.pageSize
      })
        .then(res=>{
          if(res.status == 1){
             // that.tablePage.total = res.total;
            that.data1 = res.data;
            this.showImg = false;
          }else{
            this.showImg = true;
          }
        })
        .catch((err)=>{
          this.showImg = true;
          console.log(err)
        });
    },
    addRed(){
      this.$post(SAVE_OR_EDIT_SETTING,
        {
          "activityCode":this.activityCode,
          'viewStatus':'1',
        },
        )
        .then(res=>{
          if(res.status == 1){
          }
        })
        .catch((err)=>{
          console.log(err)
        })
    },
    goDeal(data) {
      let formKey = data.TasksMap.formKey
      let code = data.activityCode
      let statusCode = data.TasksMap.statusCode
      
      Bus.$emit('getMessage')
      if(statusCode == 1){
        if (formKey == 'approveForm') {//审批表单
          this.addRed()
          sessionStorage.setItem('activityCode',data.activityCode)
          sessionStorage.setItem('repeatRecord',1)
          sessionStorage.setItem('detail',2)//2审核
          sessionStorage.setItem('taskId',data.TasksMap.taskId)
          this.$router.push('/settingIndex/activityDone')
        } else if (formKey == 'secondForm') {//复录表单
          this.addRed()
          sessionStorage.setItem('activityCode',data.activityCode)
          sessionStorage.setItem('repeatRecord',1)
          sessionStorage.setItem('detail',0)//2审核
          sessionStorage.setItem('taskId',data.TasksMap.taskId)
          this.$router.push('/settingIndex/newActivities')
        }else if(formKey == 'firstForm'){//修改
          this.addRed()
          sessionStorage.setItem('activityCode',data.activityCode)
          sessionStorage.setItem('repeatRecord',0)
          sessionStorage.setItem('taskId',data.TasksMap.taskId)
          sessionStorage.setItem('detail',0)
          this.$router.push('/settingIndex/newActivities')
        } 
      }else{
        sessionStorage.setItem('activityCode',data.activityCode)
        sessionStorage.setItem('repeatRecord',0)
        sessionStorage.setItem('taskId',data.TasksMap.taskId)
        sessionStorage.setItem('detail',1)//1详情 查看
        this.$router.push('/settingIndex/activityDone')
      }
      // Bus.$emit('selectTabAct',{
      //   oldTab:'待办事项',
      //   newTab:'活动设置'
      // })
    }
  }
};
</script>

<style scoped>
.textNews {
  width: 92%;
  border-bottom: 0.005208rem solid #f0f1f2;
  padding-bottom: 0.08rem;
  padding-top: 0.12rem;
  margin: auto;
  position: relative;
}
.tipIcon {
  position: absolute;
  margin-top: 0.05rem;
}
.tipPicDiv {
  display: flex;
}
.tipPic {
  width: 0.25rem;
  height: 0.1rem;
}
.actTittle,
.actTime {
  margin-left: 0.35rem;
}
.actTittle {
  color: #2d3343;
  font-size: 0.1rem;
  margin-bottom: 0.1rem;
}

.actTime {
  color: #666;
}

.actSubmit {
  margin-left: 0.08rem;
}

.textBtns {
  position: absolute;
  right: 0.5rem;
  margin-top: -0.25rem;
}

.deal {
  color: #3395ff;
  width: 0.4rem;
  height: 0.16rem;
  text-align: center;
  line-height: 0.16rem;
  background: #fff;
  border-radius: 0.04rem;
  cursor: pointer;
}

.deal:hover {
  color: #fff;
  background: #3395ff;
}

.el-input__inner {
  height: 0.18rem;
  border-radius: 8px;
  padding-left: 0.08rem;
  background: rgba(255, 255, 255, 1);
  border: 1px solid rgba(181, 194, 202, 1);
  margin-right: 0.2rem;
  margin-left: 0.04rem;
}

.el-date-editor .el-range-separator,
.el-date-editor .el-range__icon {
  line-height: 0;
}
.el-pagination{
	text-align: center;
	margin-top:0.1rem;
}
.textContent{
  height:34vw;
  overflow-y: auto;
}
</style>